<template>
<div class="">
<criteria partial='criteria' @show-con = "pocon" v-ref:cri>
  <div class= "form-horizontal" partial>
    <div class="col-sm-11">
      <label for="f_user_name" class="col-sm-2 control-label">用户姓名:</label>
      <div class="col-sm-2">
       <input type="text" class="form-control" v-model="model.f_user_name"  condition="t.f_user_name ='{}'" placeholder="用户姓名"/>
      </div>
      <label for="f_user_phone" class="col-sm-2 control-label">电话:</label>
      <div class="col-sm-2">
       <input type="text" class="form-control" v-model="model.f_user_phone" condition="t.f_user_phone ='{}'"  placeholder="电话"/>
      </div>
      <label for="f_idnumber" class="col-sm-2 control-label">身份证号:</label>
      <div class="col-sm-2">
       <input type="text" class="form-control" v-model="model.f_idnumber" condition="t.f_idnumber ='{}'"  placeholder="身份证号"/>
      </div>
    </div>
    <div class="col-sm-11"  style="margin-top:10px;">
      <label for="f_newuser_name" class="col-sm-2 control-label">新用户姓名:</label>
      <div class="col-sm-2">
       <input type="text" class="form-control" v-model="model.f_newuser_name"  condition="t.f_newuser_name ='{}'" placeholder="新用户姓名"/>
      </div>
      <label for="f_newuser_phone" class="col-sm-2 control-label">新用户电话:</label>
      <div class="col-sm-2">
       <input type="text" class="form-control" v-model="model.f_newuser_phone" condition="t.f_newuser_phone ='{}'"  placeholder="新用户电话"/>
      </div>
      <label for="f_newidnumber" class="col-sm-2 control-label">新身份证号:</label>
      <div class="col-sm-2">
       <input type="text" class="form-control" v-model="model.f_newidnumber" condition="t.f_newidnumber ='{}'"  placeholder="新身份证号"/>
      </div>
    </div>
    <div class="col-sm-11"  style="margin-top:10px;">
      <label for="f_transfer_fees" class="col-sm-2 control-label">过户费 :</label>
      <div class="col-sm-6">
        <v-input :value.sync="$parent.f_transfer_fees" :expression.sync = 'model.f_transfer_fees' condition="t.f_transfer_fees {}" v-model="model.f_transfer_fees" v-ref:fees><v-input>
      </div>
      <label for="f_operator" class="col-sm-2 control-label">操作人:</label>
      <div class="col-sm-2">
        <input type="text" class="form-control" v-model="model.f_operator" condition="t.f_operator ='{}'"  placeholder="操作人"/>
      </div>
    </div>
    <div class="col-sm-11"  style="margin-top:10px;">
      <label for="f_transfer_state" class="col-sm-2 control-label">过户状态:</label>
      <div class="col-sm-2">
        <v-select id="f_transfer_state"
          v-model="model.f_transfer_state"
          placeholder='请选择'
          condition="t.f_transfer_state ='{}'"
          :value.sync="model.f_transfer_state"
          :options='$parent.transferstate'
          close-on-select clear-button>
        </v-select>
      </div>
    </div>
 </div>
 </criteria>
</div>
</template>
<script>
import AppData from '../../../../../stores/AppData'
export default {
  data () {
    return {
      arr: [],
      condition: '',
      f_transfer_fees: ''
    }
  },
  methods: {
    reset () {
      this.$refs.cri.model.f_user_name = ''
      this.$refs.cri.model.f_user_phone = ''
      this.$refs.cri.model.f_idnumber = ''
      this.$refs.cri.model.f_newuser_name = ''
      this.$refs.cri.model.f_newuser_phone = ''
      this.$refs.cri.model.f_newidnumber = ''
      this.$refs.cri.model.f_transfer_fees = ''
      this.$refs.cri.model.f_operator = ''
      this.$refs.cri.model.f_transfer_state = ''
      this.$refs.cri.$refs.fees.data = ''
      this.$refs.cri.$refs.fees.symbol = ''
    },
    pocon () {
      let model = this.$refs.cri.model
      this.arr = []
      this.addElement(model.f_user_name, '用户姓名', 'f_user_name')
      this.addElement(model.f_user_phone, '电话', 'f_user_phone')
      this.addElement(model.f_idnumber, '身份证号', 'f_idnumber')
      this.addElement(model.f_newuser_name, '新用户姓名', 'f_newuser_name')
      this.addElement(model.f_newuser_phone, '新用户电话', 'f_newuser_phone')
      this.addElement(model.f_newidnumber, '新身份证号', 'f_newidnumber')
      this.addVinputElement(this.f_transfer_fees, model.f_transfer_fees, '过户费', 'f_transfer_fees')
      this.addElement(model.f_operator, '操作人', 'f_operator')
      this.addSelectElement(model.f_transfer_state, '过户状态', 'f_transfer_state')
      this.$dispatch('showcond', this.arr)
    },
    addElement (value, chineseColumn, englishColumn) {
      if (value && value !== '') {
        this.arr.push({content: `${chineseColumn}:${value}`, culmn: englishColumn})
      }
    },
    addSelectElement (value, chineseColumn, englishColumn) {
      if (value && value.length > 0 && value[0] !== '') {
        this.arr.push({content: `${chineseColumn}:${value}`, culmn: englishColumn})
      }
    },
    addVinputElement (value, value2, chineseColumn, englishColumn) {
      if (value && value2 !== '') {
        this.arr.push({content: `${chineseColumn}:${value[0][0]} ${value[1]}`, culmn: englishColumn})
      }
    },
    sort () {
      for (let key in this.$refs.cri.model) {
        let num = 0
        for (let index in this.arr) {
          if (this.arr[index].culmn !== key) {
            num++
          }
        }
        if (num === (this.arr.length)) {
          this.$refs.cri.model[key] = ''
          if (key === 'f_transfer_fees') {
            this.$refs.cri.$refs.fees.data = ''
            this.$refs.cri.$refs.fees.symbol = ''
          }
        }
      }
    }
  },
  watch: {
    'arr': {
      deep: true,
      handler (val) {
        this.sort()
        this.$refs.cri.search()
      }
    }
  },
  computed: {
    transferstate () {
      return [{label: '全部', value: ''}, ...AppData.getParam('操作状态')]
    }
  }
}
</script>
